<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String PATH = request.getContextPath();
%>

<jsp:include page="../common/header.jsp">
	<jsp:param name="title" value="职员管理"/>
</jsp:include>

<div class="page with-sidebar">
	<div class="page-header">
        <div class="page-header-content">
            <h1 style="width:500px">职员管理<small>案例</small></h1>
            <a class="back-button big page-back" href="<%=PATH %>"></a>
        </div>
    </div>
    
    <div class="page-sidebar">
    	<ul>
    		<li class="sticker sticker-color-orangeDark">
    			<a href="#touse">使用说明</a>
    		</li>
			<li class="sticker sticker-color-yellow">
    			<a href="#add">新增职员</a>
    		</li>
			<li class="sticker sticker-color-green">
    			<a href="#update">编辑职员</a>
    		</li>
			<li class="sticker sticker-color-pink">
    			<a href="#list">职员浏览</a>
    		</li>
    	</ul>
    </div>
    
    <div class="page-region">
    	<div class="grid" style="padding-left:20px;">
    		<div class="row">
				   <h2 id="touse">使用说明</h2>
				   <div>
				   		1. 这里的任何操作都是以JSON格式返回结果数据<br />
				   		2. 如果需要新增一个职员，就在下方的职员新增一栏中操作<br />
				   </div>
    		</div>
    		<br />
			
    		<div class="row">
  				  <h2 id="add">新增职员</h2>
				  <div class="hero-unit">
					1.姓名不能为空<br />
					2.密码不能为空<br />
					3.默认的职务为普通职员
				  </div>
  				  <div>
  				  	<form action="<%=PATH %>/user/add.htm" method="post">
  				  		<div class="row">
  				  			<h4 class="span2">职员姓名：</h4>
							<div class="input-control text span7">
								<input type="text" name="user.name" placeholder="职员的姓名..."/>
							</div>
  				  		</div>
						
						<div class="row">
  				  			<h4 class="span2">登陆密码：</h4>
							<div class="input-control password span7">
								<input type="password" name="user.password" placeholder="登录本公办系统的密码..."/>
							</div>
  				  		</div>
						
						<div class="row">
  				  			<h4 class="span2">所在职务：</h4>
							<div class="input-control select span7">
								<select name="user.position">
									<option value="0">普通职员</option>
									<option value="1">部门主管</option>
									<option value="2">最高管理员</option>
								</select>
							</div>
  				  		</div>
						
						<div class="row">
  				  			<h4 class="span2">所在部门：</h4>
							<div class="input-control text span7 disabled">
								<input type="hidden" name="did" value="1"/>
								<input type="text" disabled placeholder="销售部[目前不能修改]"/>
							</div>
  				  		</div>
						
						<div class="row">
  				  			<h4 class="span2">电话号码：</h4>
							<div class="input-control text span7">
								<input type="text" name="user.cellPhone" placeholder="职员的电话号码..."/>
							</div>
  				  		</div>
						
						<div class="row">
							<input type="submit" class="big place-right bg-color-pink" value="保存"/>
						</div>
  				  	</form>
  				  </div>
    		</div>
			<br />
			
			<div class="row">
  				  <h2 id="update">编辑职员</h2>
				  <div class="hero-unit">
					目前只提供以下的更新：<br />
					 * 	0	更新密码<br />
					 * 	1	更改职务<br />
					 * 	2	更改职员的有效性<br />
					 * 	3	更改职员所在部门<br />
					 * <br />
					updateType = 0/1/2/3  表示更新类型<br />
					updateValue 为更新的内容<br />
				  </div>
			</div>
			<br />
			
			<div class="row">
				<h2 id="list">职员浏览</h2>
				
				<div class="">
					输入相应的搜索条件后，点击“搜索”按钮可以进行职员的搜索。<br />
					返回数据样例：<br />
					<pre class="prettyprint linenums prettyprinted">
{
	"data":1,
	"error":false,
	"message":[{"cellPhone":"18076556349","department":{"id":1,"name":"销售部"},
			  "id":1,"joinDate":1375381051000,"name":"集成显卡","password":"24f9356fe100863f8b108d476aa4f9bc",
			  "position":4,"unable":false}]
}
					</pre>
					其中data表示总共搜索到的职员数<br />
					message是搜索结果的JSON数据集<br /><br />
				</div>
				
				<div class="grid">
					<div class="row">
						<h4 class="span2">关键字:</h4>
						<div class="input-control text span7">
							<input id="key" type="text" placeholder="请输入想要搜索的职员名称..." />
						</div>
					</div>
					
					<div class="row">
						<h4 class="span2">部门：</h4>
						<div class="input-control select span7">
							<select id="department_id">
								<option value="0">不限</option>
								<option value="1">销售部</option>
							</select>
						</div>
					</div>
					<div class="row">
						<button class="big place-right bg-color-blue" onclick="search();">搜索</button>
						<a href="#" id="search_a" target="_blank" class="big place-right" style="display:none;">
							<span id="search_span">搜索</span>
						</a>
					</div>
				</div>
			</div>
			
    	</div>
    </div>
</div>

<script>
	function search(){
		var key = $("#key").val();
		var did = $("#department_id").val();
		$("#search_a").attr("href", "<%=PATH %>/user/list.htm?key="+key+"&did="+did);
		$("#search_span").trigger("click");
		
		return true;
	}
</script>

<%@ include file="../common/footer.jsp" %>